<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>有声相册</title>
  <link rel="stylesheet" href="./css/music.css">
</head>
<body>
      <!-- 播放音乐 -->
    <div class="content-music">
        <div class="banxin">
            <div class="img-music">
                  <img src="./img/琳.webp" alt="666" class="music-img">
                  <span>《神威难藏泪》</span>
                 <p id="play-button" class="music">
                 点击播放
                 </p>
            </div>
        </div>
    </div>

  <!-- 音乐文件 -->
  <audio id="music-player" src="./img/mp3/开往春天的地铁0.9.mp3" preload="auto" loop></audio>


    <!--图片 -->
    <div class="content-img">
        <div class="banxin">
          <div class="content-img-1">
            
              <img src="./img/带土.webp" alt="6">


              <span>更多
                <div class="content-img-2">
                  <img src="./img/带土1.webp" alt="">
                  <img src="./img/白面具.webp" alt="666">
                </div>
              </span>
              
              
          </div>
        </div>
    </div>


    <!-- 文本 -->
      <div>
        <div class="banxin">
          <div class="content-text">
            <p>身处黑暗怎么能拥抱你，身赴光明又无法保护你</p>
          </div>
        </div>
      </div>


       <!--视频 -->
       <div>
        <div class="banxin">
          <div class="content-video">
            <video autoplay loop muted playsinline class="video-two">
              <source src="./img/mp4/带土.mp4" type="video/mp4">
            </video>
          </div>
        </div>
    </div>

    <div class="buttom"></div>

</body>

<script src="./js/music.js"></script>
</html>
